{% extends 'base_with_top_menu.html' %}

{% load go_back_link %}

{% block title %}Book list{% endblock %}

{% block header %} {% if for_whom %} {{ for_whom }} {% else %} Book list {% endif %} {% endblock %}

{% block content %}

    {% if display_tips %}
    <div class="tip">
      <ol>
        {% if user.get_profile.is_librarian %}
                    <li>
                        Librarian only usage: you type into ID field a substring of specific book copy shelf mark (ID) (and press Enter or click Search)
                        <ul>
                            <li>You are shown all copies with IDs containing that substring.</li>
                            <li>All other fields are ignored.</li>
                        </ul>
                    </li>
        {% endif %}
        <li>
            Typical usage:
            <ul>
                <li>Do any/all/none of: typing into Title, Author fields, selecting category/ies. Keywords should be separated with spaces.</li>
                <li>Press Search/Enter</li>
                <li>You are shown all titles (not copies) filtered by all fields you typed into</li>
                <li>Selecting checkbox next to search field will cause searching for any of typed/selected keywords.</li>
                <li>Otherwise (by default) only books containing <strong>all</strong> search words are found</li>
                <li>Regexp search is not supported for now</li>
            </ul>
        </li>
        <li><p>If you use Firefox or Opera you can click and drag to multiselect categories. In Chrome you can use CTRL+click. In IE both ways work.</p></li>
        <li><p>In categories, selecting "Any category" has effect iff nothing else is selected. If "Any" and sth else is selected, then "Any" would be automatically deselected.</p></li>
      </ol>
    </div>
    {%endif%}

    <div class="content_form">
        <form action="." method="post" name="Fbook_search" class="book_search">
          <center>
            <table>
            <tbody>
            <tr>
                <td class="first">
                    <table class="book_details">
                    <tbody>
                        {% if user.get_profile.is_librarian %}
                            <tr class="book_id">
                                <td>ID: <br><input type="text" name="id" id="id" value="{{ search.id }}"></td>
                                <td></td>
                            </tr>
                        {% endif %}
                        <tr class="book_title">
                            <td>Title: <br><input type="text" name="title" id="title" value="{{ search.title }}">
                                <input type="checkbox" name="title_any" id="title_any" value="any"  {% if search.title_any_checked %} checked {% endif %} >
                                <label for="title_any" title="Any of keywords">Any</label></td>
                        </tr>
                        <tr class="book_author">
                            <td>Author: <br><input type="text" name="author" id="author" value="{{ search.author }}">
                                <input type="checkbox" name="author_any" id="author_any" value="any"  {% if search.author_any_checked %} checked {% endif %} >
                                <label for="author_any" title="Any of keywords">Any</label></td>
                        </tr>
                    </tbody>
                    </table>
                </td>
                {% if perms.baseapp.list_costcenters %}
                    <td class="second">
                        <table class="book_details">
                        <tbody>
                            <tr class="book_cc">
                                <td class="list">
                                    Cost center: <br> 
                                    <select name="cost_center" multiple="multiple" size="{{ search.copies_location_select_size }}">
                                        {% for cc in search.ccs %}
                                            <option value="{{ cc.id }}" {% if cc.selected %}selected{% endif %}>{{ cc.name }}</option>
                                        {% endfor %}
                                    </select>
                                </td>
                            </tr>
                        </tbody>
                        </table>
                    </td>
                {% endif %}
                <td class="second">
                    <table class="book_details">
                    <tbody>
                        <tr class="book_location">
                            <td class="list">
                                Location: <br> 
                                <select name="location" multiple="multiple" size="{{ search.copies_location_select_size }}">
                                    {% for location in search.locations %}
                                        <option value="{{ location.id }}" {% if location.selected %}selected{% endif %}>{{ location.name }}</option>
                                    {% endfor %}
                                </select>
                            </td>
                        </tr>
                    </tbody>
                    </table>
                </td>
                <td class="second">
                    <table class="book_details">
                    <tbody>
                        <tr class="book_category">
                            <td class="list">
                                Category: <br> 
                                <select name="category" multiple="multiple" size="{{ search.categories_select_size }}">
                                    {% for category in search.categories %}
                                        <option value="{{ category.id }}" {% if category.selected %}selected{% endif %}>{{ category.name }}</option>
                                    {% endfor %}
                                </select>
        
                              <!-- <input type="text" name="category" value="{{ search.category }}"> -->
                            </td>
                            <td class="any"><input type="checkbox" name="category_any" id="category_any" value="any"  {% if search.category_any_checked %} checked {% endif %} >
                                <label for="category_any" title="Any of keywords">Any selected</label></td>
                        </tr>
                    </tbody>
                    </table>
                </td>
            </tr>
            <tr class="book_search">
                <td> 
                    <input type="submit" name="action" value="Search" accesskey="s"> 
                </td>
                <td></td>
            </tr>
            </tbody>
            </table>
          </center>
        </form>
    </div>

    <script type="text/javascript">
      {% if user.get_profile.is_librarian %}
      document.Fbook_search.id.focus();
      {% else %}
      document.Fbook_search.title.focus();
      {% endif %}
    </script>

    <div class="book_actions">
      {% if perms.baseapp.add_book %}
      <a href="/entelib/books/add/" class="add_book">Add new book</a>
      {% endif %}
    </div>

    {% if books %}
    <!--- BOOK SECTION -->
        <!-- TABLESORTER init -->
        <script type="text/javascript">
            $(document).ready(function()  { $("#booklist").tablesorter( {
                sortList: [[0,0]],
                textExtraction: function(node) { var value = $(node.innerHTML).text();
                                                 return value; //childNodes[0].childNodes[0].innerHTML; 
                }
            } ); } );
        </script>
        <!-- / TABLESORTER init -->
    
        {% if not none_found %}
          <div class="found_count">
            <p>Found {{books|length}} book{{books|length|pluralize}}</p>
          </div>
        {% endif %}

        <div class="found_books itemsWrapper">
            <table class="booklist tablesorter" id="booklist">
            <thead>
                <tr class="header">
                    <th>Title</th>
                    {% if show_availability %}
                        <th>Rentable</th>
                    {% endif %}
                    <th>Authors</th>
                </tr>
            </thead>
            <tbody>
                {% for book in books %}
                <tr class="book">
                    <td class="title"><a href='{{ book.book.id }}'>{{ book.book.title }}</a></td>
                    {% if show_availability %}
                        <td>{{ book.nr_of_available_copies }}</td>
                    {% endif %}
                    <td class="authors"><span>{% if book.book.author %}{{ book.book.author.all|join:', '}}{% else %}No authors.{% endif %}</span></td>
                {% endfor %}
            </tbody>
            </table>
        </div>
    <!--- END BOOK SECTION -->
    {% endif %}

    {% if bookcopies %}
    <!--- BOOK COPIES SECTION -->
        <!-- TABLESORTER init -->
        <script type="text/javascript">
            $(document).ready(function()  { $("#booklist").tablesorter( {
                sortList: [[2,0]],
                textExtraction: function(node) { var value = $(node.innerHTML).text();
                                                 return value; //childNodes[0].childNodes[0].innerHTML; 
                }
            } ); } );
        </script>
        <!-- / TABLESORTER init -->
        {% if not none_found %}
          <div class="found_count">
            <p>Found {{bookcopies|length}} book cop{{bookcopies|length|pluralize:"y,ies"}}</p>
          </div>
        {% endif %}

        <div class="found_books itemsWrapper">
            <table class="booklist tablesorter" id="booklist">
            <thead>
                <tr class="header">
                    <th>ID</th>
                    <th>State</th>
                    <th>Title</th>
                    <th>Authors</th>
                    <th>Location</th>
                </tr>
            </thead>
            <tbody>
                {% for copy in bookcopies %}
                <tr class="book">
                    {# {% if user.get_profile.is_librarian %} #}
                    <td class="shelfmark"><a href="../bookcopy/{{ copy.id }}">{{ copy.shelf_mark }}</a></td>
                    {# {% endif %} #}
                    <td class="state {%if not copy.state.is_available %}unavailable{%endif%}">{{ copy.state|safe }}</td>
                    <td class="title"><a href="{% url book_one copy.book.id %}">{{ copy.title }}</a></td>
                    <td class="authors">{% if copy.authors %}{{ copy.authors|join:', '}}{% else %}No authors.{% endif %}</td>
                    <td class="location"><a href="{% url location_one copy.location.id %}">{{ copy.location }}</a></td>
                {% endfor %}
                
            </tbody>
            </table>
        </div>
    <!--- END BOOK COPIES SECTION -->
    {% endif %}

    {% if none_found %} 
        <p><b>Sorry, no books.</b></p>
    {% else %}
        {% go_back_link %}
    {% endif %}
    
    {% if display_tips and none_found %}
    <div class="tip tips">
      <p>Why nothing was found? Here are some tips:</p>
      <ul style="margin-top:1em;">
        <li>Use spaces as separators.</li>
        <li>Title, Author and Category are combined with logical AND operator.</li>
        <li>Check your query for typos.</li>
        <li>Check if "Any" checkboxes are ticked properly.</li>
        <li>Your query is too strict.</li>
      </ul>
    </div>
    {% endif %}

{% endblock %}
